<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="/static/js/resources/ext-theme-neptune/ext-theme-neptune-all.css" rel="stylesheet"/>
    <script src="/static/js/ext-all.js" type="text/javascript"></script>
    <script src="/static/js/locale/ext-lang-zh_CN.js" type="text/javascript"></script>
    <script src="/static/js/MyUtils.js" type="text/javascript"></script>
    <script src="/static/js/jquery-3.4.0.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        var localStore = window.localStorage;
        //var localStore = new Ext.state.LocalStorageProvider();
        $(function () {
            $('#btn_set_store').click(function () {
                var map = {};
                map['page_name'] = {'vs': $('#txt').val()};
                //localStore.setItem('my_scenes', $('#txt').val());
                localStore.setItem('my_scenes', Ext.JSON.encode(map));
                //localStore.setItem('my_scenes', map);
            });

            $('#btn_get_store').click(function () {
                //$('#s').text(localStore.getItem('my_scenes'));
                var my_map = Ext.JSON.decode(localStore.getItem('my_scenes'));
                //var my_map = localStore.getItem('my_scenes');
                var vs = my_map['page_name'];
                $('#s').text(vs['vs']);
            });

            var update_work_code = function (works, work_id, code) {
                var lst = new Array();
                for (var k in works)
                {
                    if (works[k]['work_id'] != work_id)
                    {
                        lst.push(works[k]);
                    }
                }

                lst.push({'work_id': work_id, 'code': code});
                localStore.setItem('works', Ext.String.trim(Ext.JSON.encode(lst)));
            };

            $('#btn_set_store_1').click(function () {
                var works = new Array();
                works.push({'work_id': 12, 'code': 'wudafu'});
                works.push({'work_id': 13, 'code': 'wudagui'});
                $('#s').text(Ext.String.trim(Ext.JSON.encode(works)));
                localStore.setItem('works', Ext.String.trim(Ext.JSON.encode(works)));
            });

            $('#btn_get_store_1').click(function () {
                var works = Ext.JSON.decode(localStore.getItem('works'));
                update_work_code(works, 12, 'wulaoyao');
                console.log(Ext.JSON.decode(localStore.getItem('works')));
            });

            $('#btn_set_store_2').click(function () {
                var storage = new myLocalStore();
                storage.set_default_work('吴大富');
            });

            $('#btn_get_store_2').click(function () {
                var storage = new myLocalStore();
                console.log(storage.get_default_work());
            });

            $('#btn_add_tables').click(function () {
                var m = {"public": ["Categories", "CUSTOMERS", "EMPLOYEES", "EMPLOYEETERRITORIES"], "public.Categories": ["CategoryID", "CategoryName", "Description", "Picture"],
                "public.CUSTOMERS": ['CUSTOMERID', 'COMPANYNAME', 'CONTACTNAME', 'CONTACTTITLE', 'ADDRESS', 'CITY', 'REGION', 'POSTALCODE'],
                'public.ORDERS_1': ['ORDERID', 'CUSTOMERID', 'EMPLOYEEID', 'ORDERDATE'],
                'public.EMPLOYEES': ['EMPLOYEEID', 'LASTNAME', 'FIRSTNAME', 'ORDERDATE']};
                localStore.setItem('tables', Ext.JSON.encode(m));
            });

            $('#btn_add_keyword').click(function () {

            });
        });
    </script>
</head>
<body>
     <table cellpadding="0" cellspacing="0">
         <tbody>
             <tr>
                 <td><input type="text" id="txt" /></td>
                 <td><input type="button" value="设置 storage" id="btn_set_store" /></td>
                 <td><input type="button" value="读取 storage" id="btn_get_store" /></td>
             </tr>
             <tr>
                 <td><input type="text" id="txt_1" /></td>
                 <td><input type="button" value="设置 storage" id="btn_set_store_1" /></td>
                 <td><input type="button" value="读取 storage" id="btn_get_store_1" /></td>
             </tr>
             <tr>
                 <td><input type="text" id="txt_2" /></td>
                 <td><input type="button" value="设置 默认 storage" id="btn_set_store_2" /></td>
                 <td><input type="button" value="读取 默认 storage" id="btn_get_store_2" /></td>
             </tr>
         </tbody>
     </table>
     <br/>
     <br/>
     <table cellpadding="0" cellspacing="0">
         <tbody>
             <tr>
                 <td><input type="button" value="添加表定义" id="btn_add_tables" /></td>
                 <td><input type="button" value="添加关键词" id="btn_add_keyword" /></td>
             </tr>
         </tbody>
     </table>
     <span id="s"></span>
     <span style="color: red; font-weight: bolder;"></span>
</body>
</html>